<script lang="ts" setup>
	import { ref, reactive } from "vue"
	import {
		getCurrentInstance
	} from 'vue'
	import {
		useRouter
	} from 'uni-mini-router'
	import {
		onShow,
		onHide,
		onLoad,
		onReachBottom
	} from '@dcloudio/uni-app'
	import {
		userStore
	} from '@/pinia';
	const {
		proxy,
	} = getCurrentInstance()
	const userStoreInfo = userStore();
	let router = useRouter()
	let searchWord = ref('')
	let type = ref('')
	let searchHis = ref([])
	const searchResult = (e) => {
		console.log(e);
		let value = searchWord.value
		searchWord.value = ''
		uni.setStorageSync('searchHis', [...new Set([e, ...searchHis.value])])
		searchHis.value = uni.getStorageSync('searchHis')
		// if (type.value == 'index') {
		// 	router.push({
		// 		name: 'searchResult',
		// 		params: {}
		// 	})
		// }
		//  else if (type.value == 'job') {
		// 	router.push({
		// 		name: 'jobSearchResult',
		// 		params: {}
		// 	})
		// } else if (type.value == 'marketing') {

		// } else if (type.value == 'investmentCenter') {

		// }
		if (type.value == 'job') {
			router.push({
				name: 'jobSearchResult',
				params: {
					type: 'job',
					value,
				}
			})
		} else {
			router.push({
				name: 'searchResult',
				params: {
					value,
				}
			})
		}

	}
	const clickHis = (value) => {
		if (type.value == 'job') {
			router.push({
				name: 'jobSearchResult',
				params: {
					type: 'job',
					value,
				}
			})
		} else {
			router.push({
				name: 'searchResult',
				params: {
					value,
				}
			})
		}
	}
	onShow(() => {
		searchHis.value = uni.getStorageSync('searchHis')
	})
	onLoad((options) => {
		type.value = options.type
		console.log(type.value);
	})
	const clearHis = () => {
		uni.showModal({
			content: '确认清除历史记录',
			success(res) {
				if (res.confirm) {
					searchHis.value = []
					uni.setStorageSync('searchHis', [])
				} else if (res.cancel) {
				}
			}
		})
	}
</script>
<template>
	<view class="navbar">
		<u-navbar :placeholder="true" leftText="" title="" auto-back>
			<template #center>
				<view style="width: 70%;">
					<u-search placeholder="请输入关键词" v-model="searchWord" :showAction="false"
						@search="searchResult"></u-search>
				</view>
			</template>
			<template #right>
				<view class="" @click="router.back()">
					取消
				</view>
			</template>
		</u-navbar>
	</view>
	<view class="historySearch">
		<text>历史搜索</text>
		<view class="" @click="clearHis">
			<u-icon name="trash" size="20"></u-icon>
		</view>
	</view>
	<view class="hsCon">
		<text v-for="(item,index) in searchHis" :key="index" @click="clickHis(item)">{{ item }}</text>
	</view>
</template>
<style lang="scss">
	.navbar {
		width: 100%;
		height: 100rpx;
	}

	.historySearch {
		width: 90%;
		margin: 80rpx auto 0;
		display: flex;
		justify-content: space-between;
		font-weight: 600;
		font-size: 32rpx;
	}

	.hsCon {
		width: 80%;
		margin: 30rpx auto;
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;

		text {
			padding: 4rpx 30rpx;
			background-color: #e7e7e7;
			border-radius: 30rpx;
			color: #7e8186;
			font-size: 24rpx;
			margin: 10rpx 10rpx;
		}
	}
</style>